<template>
  <div>
    <el-dialog
      :title="title"
      :visible.sync="dialogVisible"
      width="700px"
      @closed="resetForm('form')"
      :close-on-click-modal="false"
    >
      <div>
        <el-form ref="form" :rules="rules" :model="form" label-width="80px">
          <el-form-item v-if="sourceType == 1" label="标题" prop="code">
            <CourseTitleSelect
              @e-courseTitleData="setCourseTitle"
              :courseType="form.courseType"
            />
          </el-form-item>
          <el-form-item v-if="sourceType == 2" label="标题" prop="title">
            <el-input v-model.trim="form.title"></el-input>
          </el-form-item>
          <el-form-item label="课程编码">
            <el-input v-model.trim="schoolInfo.code"></el-input>
          </el-form-item>
          <el-form-item label="建设单位" prop="sourceUnit">
            <UnitSelect
              v-if="dialogVisible"
              :defaultValue="defaultDept"
              @e-unitData="setUnitId"
            />
          </el-form-item>
          <el-form-item label="培训层次" prop="trainingLevel">
            <TrainingSelect
              :defaultValue="form.trainingLevel"
              @e-trainData="setTrainId"
            />
          </el-form-item>
          <el-form-item :label="zyflObj.name || '资源分类'">
            <LabelSelect
              :type="$route.meta.type"
              labelType="1"
              :defaultValue="form.labelValue"
              @e-labelData="setLabelId"
            />
          </el-form-item>
          <el-form-item label="简介" prop="content">
            <el-input
              type="textarea"
              :rows="2"
              placeholder="请输入内容"
              v-model="form.content"
            >
            </el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="custom" v-preventReClick @click="submitForm('form')"
          >提 交</el-button
        >
        <el-button @click="dialogVisible = false">取 消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {
  sysCourseAdd,
  sysCourseUpdate,
} from '@/api/admin/courseLibrary/sysCourse.js'
import homeConfig from '@/mixins/homeConfig'
import Bus from '@/utils/bus.js'
export default {
  mixins: [homeConfig],
  components: {
    TrainingSelect: () => import('@/components/trainingSelect'),
    UnitSelect: () => import('@/components/unitSelect'),
    LabelSelect: () => import('@/components/labelSelect'),
    CourseTitleSelect: () => import('@/components/courseTitleSelect'),
  },
  data() {
    return {
      title: '新增课程',
      dialogVisible: false,
      addOrEdit: 1,
      checkedData: {},
      form: {
        courseType: this.$route.meta.type, //课程类型;1-课程库，2-专业库，3-兵种库，4-专题库，5-示范微视频，6-培训资源
        title: '',
        sourceUnit: '',
        content: '',
        sourceType: 1, //1-校内，2-校外
        labelType: this.$route.meta.type,
        labelValue: '',
        code: '', //课程编号(校内，code传引用课本源ID)
        trainingLevel: '', //培训层次
        auditStatus: 1, //审核状态：1-待审核，2-审核通过，3-不通过
        status: 0, //课程状态：0-未发布，1-已发布
        sysCourseTeamList: [
          { auditStatus: 2, userId: this.$store.getters.userId },
        ],
      },
      rules: {
        code: [{ required: true, message: '请选择标题', trigger: 'blur' }],
        title: [{ required: true, message: '请输入标题', trigger: 'blur' }],
        sourceUnit: [
          { required: true, message: '请选择建设单位', trigger: 'blur' },
        ],
        trainingLevel: [
          { required: true, message: '请选择培训层次', trigger: 'blur' },
        ],
      },
      schoolInfo: {},
      zylxObj: {}, // 资源类型
      zyflObj: {}, // 资源分类
      pxccObj: {}, // 培训层次
      tgdwObj: {}, // 提供单位
    }
  },
  props: ['sourceType'],
  computed: {
    defaultDept: function () {
      if (this.addOrEdit == 1) {
        let deptFullData = this.$store.getters.deptFullData
        if (deptFullData && deptFullData.childList.length) {
          return deptFullData.childList[0].id
        }
        return ''
      }
      return this.form.sourceUnit
    },
  },
  mounted() {
    this.zylxObj = this.showModuleObj('zylx')
    this.zyflObj = this.showModuleObj('zyfl')
    this.pxccObj = this.showModuleObj('pxcc')
    this.tgdwObj = this.showModuleObj('tgdw')
    Bus.$on('showDialogCourseAdd', (v) => {
      if (v) {
        this.checkedData = v
        this.handleAddOrEdit(2)
      } else {
        this.form.sourceUnit = this.defaultDept
        this.handleAddOrEdit(1)
      }
    })
  },
  beforeDestroy() {
    Bus.$off('showDialogCourseAdd')
  },
  methods: {
    setCourseTitle(v) {
      this.form.code = v.id || ''
      this.schoolInfo = v || {}
    },
    setTrainId(v) {
      this.form.trainingLevel = v || ''
    },
    setUnitId(v) {
      this.form.sourceUnit = v || ''
    },
    setLabelId(v) {
      this.form.labelValue = v
    },
    //显示弹窗
    handleAddOrEdit(type) {
      if (type == 2) {
        this.title = '编辑课程'
        for (let i in this.checkedData) {
          if (this.form.hasOwnProperty(i)) {
            this.form[i] = this.checkedData[i] || ''
          }
        }
        this.form.id = this.checkedData.id
      } else {
        this.title = '新增课程'
        delete this.form.id
      }
      this.addOrEdit = type
      this.dialogVisible = true
    },
    submitForm(form) {
      this.form.sourceType = this.sourceType
      this.form.labelValue = this.form.labelValue.toString()
      this.$refs[form].validate((valid) => {
        if (valid) {
          this.addOrEdit == 1 ? this.add() : this.edit()
        }
      })
    },
    //新增
    add() {
      sysCourseAdd(this.form).then((res) => {
        this.dialogVisible = false
        Bus.$emit('refreshCourseList')
        this.$message({
          message: '操作成功',
          type: 'success',
        })
      })
    },
    //编辑
    edit() {
      sysCourseUpdate(this.form).then((res) => {
        this.dialogVisible = false
        Bus.$emit('refreshCourseList')
        this.$message({
          message: '操作成功',
          type: 'success',
        })
      })
    },
    //重置表单
    resetForm(form) {
      this.$refs[form].resetFields()
      for (let key in this.form) {
        if (key != 'sysCourseTeamList') {
          this.form[key] = ''
        }
      }
      this.form.courseType = 1
      this.form.auditStatus = 1
      this.form.labelType = 1
      this.form.status = 0
      this.schoolInfo = {}
    },
  },
}
</script>